<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>产品参数打印</title>
<link href="__TPL_CSS__/color_lable.css?t={:time()}" rel="stylesheet" type="text/css"/>
</head>
<style>
	.print_but a{
		margin-right: 10px;
	}
	.tips{
		padding-top: 20px;
		text-align: center;
		color: brown;
	}
</style>

<body>
<div class="print_but">
  <p><a http_printer="1"><i class="layui-icon layui-icon-edit"></i>打印竖标签</a> <a http_printer="2">打印详细标签</a> <a http_printer="3">打印简洁标签</a></p>
</div>

<div class="print-page" id="printDiv">
	<div class="tips">展示效果仅为默认模板，实际打印内容请以打印预览为准</div>
  <div class="orderprint">
      {volist name="T" id="v"}
          <!--<php>$count++</php>-->
          <div class="labelbox">
            <div class="top">
              <div>产品参数</div>
            </div>
            <table class="pro-info">
              <tbody>
                    <tr>
                        <td width="16%">编号</td>
                        <td colspan="3" width="84%" class="lf">{$v.number}</td>
                    </tr>
                    <tr>
                        <td width="16%">品名</td>
                        <td colspan="3" width="84%" class="lf">{$v.title}</td>
                    </tr>
                    <tr>
                        <td width="16%">幅宽</td>
                        <td width="30%" class="lf">{$v.breadth} cm</td>
                        <td width="16%">克重</td>
                        <td width="38%" class="lf">约{$v.square}G</td>
                    </tr>
                    <tr>
                        <td width="16%">大货</td>
                        <td colspan="3" width="84%" class="lf">净布一公斤约出{$v.kgm}米</td>
                    </tr>
                    <tr>
                        <td width="16%">毛重</td>
                        <td colspan="3" width="84%" class="lf">含纸管：{$v.tube}KG&nbsp;&nbsp;空差：{$v.emptykg}KG</td>
                    </tr>
                    <tr>
                        <td width="16%">成分</td>
                        <td colspan="3" width="84%" class="lf">{$v.component}&nbsp;&nbsp;(花灰另问)</td>
                    </tr>
                </tbody>
            </table>
            <div class="foot">花灰、活性黑、撞白色、部分深色价格另问</div>
          </div>
      {/volist}
  </div>
</div>

<script src="__JS__/jquery.1.8.3.js"></script>
<script src="/static/component/layui/layui.js"></script>
<script>
	
	$(document).ready(function(){
		layui.use('layer', function(){
			var layer = layui.layer;
		});
		
		//打印销售单
		$("[http_printer]").click(function(){
			var print_url = 'http://{$print["ip"]}:{$print["port"]}/';
			var post1 = '{$print_data1|raw}';
			var post2 = '{$print_data2|raw}';
			var post3 = '{$print_data3|raw}';
			var msg_post = '';
			var post_number=parseInt($(this).attr('http_printer'));

			switch(post_number){
				case 1:
					msg_post=post1
					break;
				case 2:
					msg_post=post2
					break;
				case 3:
					msg_post=post3
					break;
				default:
					msg_post=post1
					break;
			}

			var msg = '{"method":"getprinterlist","token":"","taskid":""}';	
			jQuery.support.cors = true;         //写到$.ajax $.get $.post 前面 解决 jQuery.Ajax IE8,9 无效（CORS跨域）						
			 
			$.get(
				print_url+'?time='+new Date().getTime(),
				function (data, status, jqxhr) {
					jQuery.support.cors = true;         //写到$.ajax $.get $.post 前面 解决 jQuery.Ajax IE8,9 无效（CORS跨域）								
					
					$.ajax({
						async : false, //循环打印时,　async 必须设置为 false，则所有的请求均为同步请求，在没有返回值之前，同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行。
						url : print_url,
						type : "POST",
						contentType: "application/x-www-form-urlencoded",  
						dataType : "json", //设置为 json 格式
						xhrFields: {withCredentials: false},
						crossDomain: true, 
						data : msg_post,
						beforeSend: function (XMLHttpRequest) {
							 // beforeSend 函数里 不允许添加任何 东西	
				             //XMLHttpRequest.setRequestHeader("token", 'abcd1234'); //不允许 使用jQuery发送AJAX请求时在header中添加Token
				        },
						success: function(data){
							console.log(JSON.stringify(data));			
							if(data.status=="ok"){
								// alert("打印成功:"+data.data);				
							}else{
								// alert("打印失败:"+data.data);
							}
						},
						error: function(data){
							//console.log(status, response);
							console.log(JSON.stringify(data));
							alert("连接HttpPrinter失败:"+JSON.stringify(data));
						}
					});	  
					
			}).fail(function () {
				alert('链接失败');
				var index = layer.confirm('连接HttpPrinter失败？', {
				  btn: ['下载','启动试试','关闭'] //按钮
				}, function(){
				  //弹出下载链接
				  window.open('http://www.httpprinter.com/httpprinter.html',"_blank"); //转到一个新的tab
				  //关闭提示框		
				  layer.close(index); 
				}
				, function(){
				layer.close(index); 
				  //启动本地exe文件				  
				  window.open('HttpPrinter://hello',"_blank"); //转到一个新的tab
				  //关闭提示框		
				  layer.close(index); 
				}
				, function(){
					//关闭提示框		
					layer.close(index); 				  
				}
				);
			});
		  });
	})
</script>
</body>
</html>